<!DOCTYPE HTML>
<html>
    <head>
        <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>
        <script type="text/javascript" charset="utf-8" src="childbrowser.js"></script>
        <script type="text/javascript" charset="utf-8" src="jquery.json.js"></script> 
        <script type="text/javascript" src="js/connector.js"></script>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
		<script type="text/javascript" charset="UTF-8">
			function loadFromUrl(){
				
				var url = 'http://error.sinaapp.com/demo.php';
				
				$.post( url , {} , function( data )
				{
					var output = $('#output');  
					var ret = jQuery.parseJSON( data );
					output.append(ret);
						
				} , 'html' );
				
				
				
				/*
				$(document).ready(function(){  
				var output = $('#output');  
				$.ajax({  
				url: 'http://error.sinaapp.com/demo.php',  
				dataType: 'jsonp',  
				jsonp: 'jsoncallback',  
				timeout: 5000,  
				success: function(data, status){  
				$.each(data, function(i,item){  
				var landmark = '<h1>'+item.mid+'</h1>' 
				+ '<p>'+item.title+'<br>' 
				+ item.longitude+'</p>';  
				output.append(landmark);  
				});  
				},  
				error: function(){  
				output.text('There was an error loading the data.');  
				}  
				 });  
				 }); */

			}
	
	
        	function clickme(type){
        		try{
        			var uri;
        			switch(type){
        				case "web": uir = ("http://www.google.com"); window.plugins.childBrowser.showWebPage(uir);break;
        				case "tel": uir = ("tel:114"); window.plugins.childBrowser.openExternal(uir);break;
        				case "contacts": uir = ("content://contacts/people/"); window.plugins.childBrowser.openExternal(uir);break;
        				case "peopel": uir = ("contacts://contacts/people/1"); window.plugins.childBrowser.openExternal(uir);break;
        				case "geo": uir = ("geo:31.23136,121.47004"); window.plugins.childBrowser.openExternal(uir);break;
        				case "file": uir = ("file:///android_asset/www/another.html"); window.plugins.childBrowser.openExternal(uir);break;
        				case "net" : //do something
        					loadFromUrl();
        					var url = 'http://error.sinaapp.com/demo.php';
        					
        					$.post( url , {} , function( data )
        					{
        						var key = hex_md5( url );
        						
        						var ret = jQuery.parseJSON( data );
        						window.localStorage.setItem( key , data );
        						// must add setTimeOut otherwise last item of list will not be rendered.	
        						// Remember to refresh when contents are loaded (ie: on ajax completion)
        						$("#test").empty();
        						$('#test').tmpl(ret).appendTo( "#last" );
        							
        					} , 'html' ); break;
        				default: throw new Error("Unknown type: " + type);
        			}
        		}catch(ex){
        			alert(ex.message);
        		}
        	}
        </script>
        
        <style type="text/css">
        	input{
        		display: block;
        		margin: 20px auto;
        		width: 80%;
        	}
        </style>
    </head>
    <body>
    	<input type="button" value="web page" onclick="clickme('web');" />
    	<input type="button" value="tel" onclick="clickme('tel');" />
    	<input type="button" value="contacts list" onclick="clickme('contacts');" />
    	<input type="button" value="contacts peopel" onclick="clickme('peopel');" />
    	<input type="button" value="geo" onclick="clickme('geo');" />
    	<input type="button" value="mp3" onclick="clickme('file');" />
    	<input type="button" id="last" value="network" onclick="clickme('net');" />
    	<h5 id="output"></h5>
    </body>
</html>